<template>
    <h2>项目申请状态统计折线图</h2>
    <div id="main" :style="{width: '600px', height: '600px'}"></div>
</template>

<script>
    import http from "../utils/req";
    import *as echarts from 'echarts';
    export default {
        name: "projectJADrawLine",
        data() {
            return {
                chartData: [],
            }
        },
        mounted() {
            this.drawProjectJA();
        },
        methods: {
            drawProjectJA() {
                http.get('/dProjectJoinApply', {
                    data:
                        {id: 1, name: 'zhangsan'}
                })
                    .then(response => {
                        console.log(response.data);
                        this.opinionData = response.data;
                        this.chartData = response.data;
                        console.log(this.chartData);
                        this.drawLine('main')
                    }, response => {
                        console.log("error");
                    });
            },
            drawLine(id) {
                for (let i =0;i< 3;++i){
                    if (!this.chartData[i]){
                        this.chartData[i] = {state: i+1}
                    }
                }
                this.charts = echarts.init(document.getElementById(id))
                this.charts.setOption({
                    tooltip : {
                        trigger: 'item'
                    },
                    xAxis: {
                        type: 'category',
                        data: ['未通过','通过','未处理']
                    },
                    yAxis: {
                        type: 'value'
                    },
                    series: [{
                        data: [this.chartData[0].num,this.chartData[1].num,this.chartData[2].num],
                        type: 'line'
                    }]
                })
            }
        }

    }

</script>

<style scoped>

</style>
